<ion-header>
    <ion-navbar color="orange">
        <ion-title>
            我的钱包
        </ion-title>
    </ion-navbar>
</ion-header>

<ion-content>
    <!-- 头部开始 -->
    <div class="m-top">
        <div class="ht-100 ht-overflow">
            <div class="m-bg">
                <img src="assets/imgs/m-bg2.png" alt="" class="m-img">
                <div class="m-je">
                    <span class="ht-font-15 ht-fff ht-100 ht-inline-block">金额（元）</span>
                    <span class="ht-font-26 ht-fff ht-100 ht-inline-block">{{walletInfo?.user_money}}</span>
                </div>
            </div>
            <!-- 按钮 -->
            <div class="m-xx">
                <div class="ht-100 ht-overflow ht-padding-tb ht-text-center">
                    <span class="m-an" (click)="goRecharge()">充值</span>
                    <span class="m-an" (click)="goWithdraw()">提现</span>
                </div>
                <div class="ht-100 ht-overflow ht-text-center ht-font-15 ht-fff">
                    <div class="ht-50 ht-float-left">
                        <span class="ht-100 ht-inline-block ht-line-30">年度总收入(元)</span>
                        <span class="ht-100 ht-inline-block ht-line-30">{{walletInfo?.income}}</span>
                    </div>
                    <div class="ht-50 ht-float-left">
                        <span class="ht-100 ht-inline-block ht-line-30">年度总支出(元)</span>
                        <span class="ht-100 ht-inline-block ht-line-30">{{walletInfo?.payment}}</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 头部结束 -->
    <!-- 图标组开始 -->
    <div class="ht-100 ht-overflow ht-border-bottom ht-999" padding-top padding-bottom>
        <div class="ht-50 ht-float-left ht-text-center" (click)="changeTab('payment')">
            <img [src]="currentTab == 'payment' ? tabInfo.payment.active : tabInfo.payment.default" alt=""
                 class="m-icon">
            <br>
            <span [style.color]="currentTab == 'payment' ? '#ff4536' : '#999999'">我的支付</span>
        </div>
        <div class="ht-50 ht-float-left ht-text-center" (click)="changeTab('income')">
            <img [src]="currentTab == 'income' ? tabInfo.income.active : tabInfo.income.default" alt=""
                 class="m-icon"><br>
            <span [style.color]="currentTab == 'income' ? '#ff4536' : '#999999'">我的收入</span>
        </div>
        <!--<div class="ht-33 ht-float-left ht-text-center" (click)="changeTab('warehouse')">-->
        <!--<img [src]="currentTab == 'warehouse' ? tabInfo.warehouse.active : tabInfo.warehouse.default" alt="" class="m-icon"><br>-->
        <!--<span [style.color]="currentTab == 'warehouse' ? '#ff4536' : '#999999'">我的库房</span>-->
        <!--</div>-->
    </div>
    <!-- 图标组结束 -->
    <!-- 信息我的支付开始 -->
    <div class="ht-100 ht-overflow" *ngIf="currentTab == 'payment'">
        <div *ngIf="detailInfo?.payment && detailInfo?.payment.length">
            <div class="ht-100 ht-overflow ht-border-bottom" padding *ngFor="let detail of detailInfo?.payment">
                <div class="ht-100 ht-overflow ht-line-20 ht-font-14 ht-333">
                    <span class="ht-float-left">{{detail.user_note}}</span>
                </div>
                <div class="ht-100 ht-overflow ht-line-20 ht-999">
                    <span class="ht-float-left ht-font-12">{{detail.change_time}}</span>
                    <span class="ht-float-right ht-font-14">{{detail.amount}}元</span>
                </div>
            </div>
        </div>
        <ion-infinite-scroll (ionInfinite)="doInfinite($event)">
            <ion-infinite-scroll-content></ion-infinite-scroll-content>
        </ion-infinite-scroll>
    </div>
    <!-- 信息我的支付结束 -->
    <!-- 信息我的收入开始 -->
    <div class="ht-100 ht-overflow" *ngIf="currentTab == 'income'">
        <div *ngIf="detailInfo?.income && detailInfo?.income.length">
            <div class="ht-100 ht-overflow ht-border-bottom" padding *ngFor="let detail of detailInfo?.income">
                <div class="ht-100 ht-overflow ht-line-20 ht-font-14 ht-333">
                    <span class="ht-float-left">{{detail.user_note}}</span>
                </div>
                <div class="ht-100 ht-overflow ht-line-20 ht-999">
                    <span class="ht-float-left ht-font-12">{{detail.change_time}}</span>
                    <span class="ht-float-right ht-font-14">{{detail.amount}}元</span>
                </div>
            </div>
        </div>
        <ion-infinite-scroll (ionInfinite)="doInfinite($event)">
            <ion-infinite-scroll-content></ion-infinite-scroll-content>
        </ion-infinite-scroll>
    </div>
    <!-- 信息我的收入结束 -->
    <!-- 信息我的仓库开始 -->
    <!--<div class="ht-100 ht-overflow" *ngIf="currentTab == 'warehouse'">-->
    <!--&lt;!&ndash; 1 &ndash;&gt;-->
    <!--<div class="ht-100 ht-overflow ht-border-bottom" padding>-->
    <!--<div class="ht-100 ht-overflow ht-line-20 ht-font-15 ht-333">-->
    <!--<span class="ht-float-left">购买VIP服务3</span>-->
    <!--<span class="ht-float-right">-5100元</span>-->
    <!--</div>-->
    <!--<div class="ht-100 ht-overflow ht-line-20 ht-font-13 ht-999">-->
    <!--<span class="ht-float-left">2017-01-03 07:58:23</span>-->
    <!--</div>-->
    <!--</div>-->
    <!--&lt;!&ndash; 2 &ndash;&gt;-->
    <!--<div class="ht-100 ht-overflow ht-border-bottom" padding>-->
    <!--<div class="ht-100 ht-overflow ht-line-20 ht-font-15 ht-333">-->
    <!--<span class="ht-float-left">信息查看费</span>-->
    <!--<span class="ht-float-right">-50元</span>-->
    <!--</div>-->
    <!--<div class="ht-100 ht-overflow ht-line-20 ht-font-13 ht-999">-->
    <!--<span class="ht-float-left">2017-01-03 07:58:23</span>-->
    <!--</div>-->
    <!--</div>-->
    <!--&lt;!&ndash; 3 &ndash;&gt;-->
    <!--<div class="ht-100 ht-overflow ht-border-bottom" padding>-->
    <!--<div class="ht-100 ht-overflow ht-line-20 ht-font-15 ht-333">-->
    <!--<span class="ht-float-left">有偿分享支出</span>-->
    <!--<span class="ht-float-right">-20元</span>-->
    <!--</div>-->
    <!--<div class="ht-100 ht-overflow ht-line-20 ht-font-13 ht-999">-->
    <!--<span class="ht-float-left">2017-01-03 07:58:23</span>-->
    <!--</div>-->
    <!--</div>-->
    <!--<ion-infinite-scroll (ionInfinite)="doInfinite($event)">-->
    <!--<ion-infinite-scroll-content></ion-infinite-scroll-content>-->
    <!--</ion-infinite-scroll>-->
    <!--&lt;!&ndash;  &ndash;&gt;-->
    <!--</div>-->
    <!-- 信息我的仓库结束 -->
</ion-content>
